// import FroalaEditor from "froala-editor";
// import "./index.less";
// import { useEffect, useRef } from "react";

// import "froala-editor/css/froala_editor.pkgd.min.css";
// import "froala-editor/css/froala_style.min.css";
// import "froala-editor/js/languages/zh_cn";

// import "froala-editor/js/plugins/image.min";
// import "froala-editor/js/plugins/font_size.min";
// import "froala-editor/js/plugins/link.min";
// import "froala-editor/js/plugins/align.min";
// import "froala-editor/js/plugins/quote.min";

// // 表情
// import "froala-editor/js/plugins/emoticons.min";
// import "froala-editor/css/plugins/emoticons.min.css";

// //特殊字符
// import "froala-editor/js/plugins/special_characters.min";
// import "froala-editor/css/plugins/special_characters.min.css";

// const RichTextEditor: React.FC<{
//   value?: string;
//   onChange?: (v: string) => void;
//   maxLength?: number;
// }> = ({ value = "", maxLength = 2000, onChange }) => {
//   const ref = useRef<HTMLDivElement>(null);
//   const editorRef = useRef<FroalaEditor>(null);

//   useEffect(() => {
//     editorRef.current = new FroalaEditor(ref.current, {
//       language: "zh_cn",
//       editorClass: "rich-editor",
//       placeholderText: "输入内容",
//       charCounterMax: maxLength,
//       heightMin: "30vh",
//       toolbarButtons: {
//         moreText: {
//           buttons: textBtns,
//           buttonsVisible: 10,
//         },
//         moreParagraph: {
//           buttons: paragraphBtns,
//           buttonsVisible: 3,
//         },
//         moreRich: {
//           buttons: richBtns,
//           buttonsVisible: 3,
//         },
//         moreMisc,
//       },
//       toolbarButtonsXS: {
//         moreText: {
//           buttons: textBtns,
//           buttonsVisible: 0,
//         },
//         moreParagraph: {
//           buttons: paragraphBtns,
//           buttonsVisible: 0,
//         },
//         moreRich: {
//           buttons: richBtns,
//           buttonsVisible: 0,
//         },
//         moreMisc,
//       },
//       fontSize: ["16", "18"],
//       imageEditButtons: [
//         "imageDisplay",
//         "imageAlign",
//         "imageRemove",
//         "|",
//         "imageLink",
//         "linkEdit",
//         "linkRemove",
//       ],
//       imageUploadMethod: "POST",
//       imageMaxSize: 5 * 1024 * 1024,
//       imageAllowedTypes: ["jpeg", "jpg", "png"],
//       events: {
//         initialized() {
//           this.html.set(value);
//         },
//         contentChanged() {
//           onChange?.(this.html?.get());
//           //对于图片资源，在保存html的时候，
//           //先解析object-url成file对象上传后，得到url，
//           //在替换html中的object-url，然后在保存html
//           // URL.createObjectURL()
//         },
//       },
//     });

//     return () => {
//       editorRef.current?.destroy();
//     };
//   }, []);

//   return <div ref={ref} />;
// };

// export default RichTextEditor;

// const textBtns = [
//   "bold",
//   "italic",
//   "fontSize",
//   "underline",
//   "strikeThrough",
//   "subscript",
//   "superscript",
//   "clearFormatting",
// ];
// const paragraphBtns = ["align", "quote"];
// const richBtns = [
//   "insertLink",
//   "insertImage",
//   "emoticons",
//   "specialCharacters",
//   "insertHR",
// ];

// const moreMisc = {
//   buttons: ["undo", "redo"],
//   align: "right",
//   buttonsVisible: 2,
// };
